@import './color.less';
body{
    background: @bodyColor;
}
.apply{
    margin-bottom: 48px;
}
.apply-info{
    background: #fff;
    margin: 10px 4%;
    /* height: 500px; */
    border-radius: 8px;
    padding:0px 6%;
//  overflow: hidden;
    margin-top: 30px;
    h3{
        width: 100%; 
        height: 30px;
        position: relative;
    }
    h3:before{
        content: "";
        display: block;
        width: 100%;
        height: 90px;
        position: absolute;
        top: -150%;
        left:0%;
        background: url(../images/applyInfoTitle.png) no-repeat center center;
        background-size: 50%;
    }
    p{
        height: 55px;
        line-height: 55px;
        color: #0f0e17;
        font-size: 16px;
        input{
            background:@writeFontBg;
            width: 70%;
            float: right;
            font-size: 14px;
            border: none;
            outline: none;
            text-indent: 1em;
            height: 40px;
            border-radius: 4px;
            margin: 4px 0;
            
        }
        span{
            display: block;
            width: 70%;
            float: right;
            
            background:@writeFontBg;
            height:80px;
           margin: 4px 0;
           border-radius: 4px;
        }
        .postal{
            width: 90%;
            height: 80px;
            line-height: 40px;            
            font-size: 14px;
            background:@writeFontBg;
            border-radius: 4px;
             outline: none;
             border: none;
             max-height: 80px;
            max-width: 90%;
            min-height: 80px;
            min-width: 90%;
            resize : none;
            padding-left: 1em;
        }
    }
    .postalTit{
        height: 80px;
    }
    .apply-userTel{
        position: relative;
        margin-bottom: 10px;
        span{
            position: absolute;
            left: 30%;
            bottom: -15px;
            font-size: 12px;
            color: #ff4848;
            background: none;
            height: 20px;
            display: block;
            width: 70%;
            line-height: 20px;
        }
    }
    .apply-img{
        width: 100%;
        margin-top: 15px;
        height: 140px;
        margin-bottom: 30px;
        div{
            width: 30%;
            height: 140px;
            border-radius: 4px;
            float: left;
        }
        &-left{
            position: relative;
        }
        &-left:before{
            display: block;
            content: "最多上传三张";
            font-size: 12px;
            width: 85%;
            text-align: center;
            height: 24px;
            line-height: 24px;
            position: absolute;
            bottom:-24px;
            left: 0;
        }
//      &-left-after{
//          display: block;
//        content: "上传后会对图片进行裁剪";
//        color:#ff4848;
//        font-size: 12px;
//        width: 85%;
//        text-align: center;
//        height: 24px;
//        line-height: 24px;
//        position: absolute;
//        bottom: -24px;
//        left: 0;
//      }
        &-center{
            margin: 0 5%;
        }
        &-right{
            position: relative;
            div{
                width: 100%;
                height: 48%;
                border-radius: 4px;
            }
            .userImg3{
                position: absolute;
                left: 0;
                bottom:0;
            }
        }
    }
    .commitBtn{
        width: 100%;
        height: 40px;
        text-align: center;
        margin-top: 20px;
        a{
            display: block;
            width: 100%;
            height: 36px;
            line-height: 36px;
            background:@buttonTopColor; /* 一些不支持背景渐变的浏览器 */  
            background:-moz-linear-gradient(top,@buttonTopColor, @buttonButtomColor);  
            background:-webkit-gradient(linear, 0 0, 0 bottom, from(@buttonTopColor), to(@buttonButtomColor));  
            background:-o-linear-gradient(top, @buttonTopColor, @buttonButtomColor); 
            color: #fff;
            margin: 0 auto;
            border-radius: 4px;
            box-shadow: 2px 2px 5px #969696;
        }
    }
}
#apply-user{
    display: none;
}
.apply-user{
    background: #fff;
    margin: 10px 4%;
    /* height: 500px; */
    border-radius: 8px;
    padding: 14px 6%;
    overflow: hidden; 
    
    p{
        text-align: center;
        font-size: 16px;
    }
    &-top{
        margin-top: 20px;
       .userImg{
           position: relative;
           width: 50%;
           height: 180px;
           margin: 0 auto;
           div{
              border-radius: 8px; 
           }
           &-img1{
               height: 100%;
           }
           &-img2{
               position: absolute;
               width: 50%;
               height: 50%;
               top: 44%;
               left: -54%;
               transform: rotate(6deg);  
           }
           &-img3{
               position: absolute;
               width: 50%;
               height: 50%;
               top: 34%;
               right: -54%;
               transform: rotate(-8deg);  
           }
       }  
    }
    &-fot{
       span{
           display: block;
           width: 50%;
           height: 40px;
           line-height: 40px;
           float: left;
       } 
       p{
           line-height: 30px;
           text-align: left;
       }
       .use-dis{
           width: 90%;
            height: 80px;
            line-height: 40px;            
            font-size: 14px;
            background:@writeFontBg;
            border-radius: 4px;
             outline: none;
             border: none;
             max-height: 80px;
            max-width: 90%;
            min-height: 80px;
            min-width: 90%;
            resize : none;
            padding-left: 1em;
       }
       a{
            display: block;
            width: 60%;
            border-radius: 6px;
            height: 36px;
            line-height: 36px;
            color: #fff;
            text-align: center;
            margin: 0 auto;
            margin-top: 10px;
       }
       .unvote{
           background:@buttonTopColor; /* 一些不支持背景渐变的浏览器 */  
            background:-moz-linear-gradient(top,@buttonTopColor, @buttonButtomColor);  
            background:-webkit-gradient(linear, 0 0, 0 bottom, from(@buttonTopColor), to(@buttonButtomColor));  
            background:-o-linear-gradient(top, @buttonTopColor, @buttonButtomColor);
       }
       .applyVote{
           background: @tabColor;
       }
    }
}
